<template>
	<view class="container">
		<uni-card :title="item.userId" thumbnail="" :extra="item.postDate" :note="item.foodId"
			v-for="(item,index) in commentlist">
			<text>{{item.comment}}</text>
		</uni-card>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				"pageIndex": 1,
				"pageSize": 10,
				"foodid": 1,
				"commentlist": [

				],
			}
		},
		methods: {
			onPullDownRefresh() {
				this.reload()
			},
			reload() {
				uni.request({
					url: 'http://localhost:8090/foodapp/comments/getCommentsByFoodIdByPage',
					method: 'POST',
					header: {
						'content-type': 'application/json' 
					},
					data: {
						foodid: this.foodid || 1,
						pageIndex: 1,
						pageSize: this.pageSize
					},
					success: res => {
						this.commentlist = res.data.data.content
						console.log(this.commentlist);

					},
					fail: (err) => {
						console.log(err);
					},
					complete: () => {
						uni.stopPullDownRefresh()
					}
				});
			},
			onReachBottom() {
				uni.showLoading()
				setTimeout(() => {
					this.loadmore()
				}, 1000);
			},
			loadmore() {

				this.pageIndex = this.pageIndex + 1
				uni.request({
					url: 'http://localhost:8090/foodapp/comments/getCommentsByFoodIdByPage',
					method: 'POST',
					header: {
						'content-type': 'application/json' 
					},
					data: {
						foodid: this.foodid || 1,
						pageIndex: this.pageIndex,
						pageSize: this.pageSize
					},
					success: res => {
						this.commentlist = this.commentlist.concat(res.data.data.content)
						console.log(this.commentlist);

					},
					fail: (err) => {
						console.log(err);
					},
					complete: () => {
						uni.hideLoading()
					}
				});
			}

		}
	}
</script>

<style>
	.container {
		padding: 20px;
		font-size: 14px;
		line-height: 24px;
	}
</style>
